<template>
  <div class="wrap-left-form">
    <el-form
      class="custom-form"
      ref="ruleFormRef"
      :model="formData"
      label-width="120px"
      runningStatus-icon
      :inline="true"
    >
      <div class="form-group-title">基本信息</div>
      <div class="form-item-info">
        <el-form-item class="form-itme-width_25" label="项目名称" id="projectId" prop="projectId">
          <dc-view v-model="formData.projectId" objectName="project" />
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="单据类型"
          id="fBillTypeId"
          prop="fBillTypeId"
        >
          <dc-dict type="text" :options="DC_BILL_TYPE" :value="formData.fBillTypeDictId"></dc-dict>
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="销售组织"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fSaleOrgDictName }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="预测组织" v-else>
          {{ formData.fForeOrgDictName }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="销售员">
          {{ formData.fSalerName }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="销售部门">
          {{ formData.fSaleDeptName }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="日期">
          {{ formData.fDate }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="客户">
          <el-tooltip :content="formData.fCustName" raw-content>
            <div>{{ formData.fCustName }}</div>
          </el-tooltip>
        </el-form-item>

        <el-form-item
          class="form-itme-width_25"
          label="变更原因"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fChangeReason }}
        </el-form-item>

        <el-form-item
          class="form-itme-width_25"
          label="利润中心"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fQlktText1 }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="业务类型">
          {{ formData.fBusinessType }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="终端客户">
          {{ formData.fOraBaseName }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="结算币种">
          {{ formData.fSettleCurrName }}
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="交货方式"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fHeadDeliveryWayName }}
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="库别"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fQlktText2 }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="TPM">
          {{ formData.fTpmName }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="项目类型">
          {{ formData.fBdkText7Name }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="订单类型">
          {{ formData.fOraCombo }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="收款条件">
          <el-tooltip :content="formData.fRecConditionName" raw-content>
            <div>{{ formData.fRecConditionName }}</div>
          </el-tooltip>
        </el-form-item>

        <el-form-item
          class="form-itme-width_25"
          label="升级"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          <span v-if="formData.fEwUpgrad === true">是</span>
          <span v-else>否</span>
        </el-form-item>

        <el-form-item
          class="form-itme-width_25"
          label="厂商地址"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fQlktText3 }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="研发订单">
          <span v-if="formData.fEwIsDev === true">是</span>
          <span v-else>否</span>
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="联系人"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fQlktText4 }}
        </el-form-item>
        <el-form-item class="form-itme-width_25" label="运营跟单">
          {{ formData.fOraText3Name }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="项目编号">
          {{ formData.fBdkBase }}
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="是否含税"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          <span v-if="formData.fIsIncludedTax === true">是</span>
          <span v-else>否</span>
        </el-form-item>
        <el-form-item
          class="form-itme-width_25"
          label="电话"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fQlktText5 }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="采购">
          {{ formData.fBdkText6 }}
        </el-form-item>

        <el-form-item class="form-itme-width_25" label="备注">
          {{ formData.fNote }}
        </el-form-item>

        <el-form-item
          class="form-itme-width_25"
          label="收货地址"
          v-if="formData.fBillTypeDictParent == '1870708016893067265'"
        >
          {{ formData.fOraBase2 }}
        </el-form-item>
      </div>
    </el-form>
  </div>
  <div class="form-group-title form-group-header-title">销售订单明细</div>
  <!-- 销售单表格 -->
  <el-table
    :data="formData.dcErpOrderItemList"
    v-if="formData.fBillTypeDictParent == '1870708016893067265'"
  >
    <el-table-column label="序号" width="60" type="index" align="center">
      <template #default="scoped">
        <span>{{ (queryParams.current - 1) * queryParams.size + scoped.$index + 1 }}</span>
      </template>
    </el-table-column>

    <el-table-column
      prop="fMaterialId"
      label="物料编码"
      align="center"
      width="150"
      show-overflow-tooltip
    >
    </el-table-column>
    <el-table-column
      prop="fMaterialName"
      label="物料名称"
      align="center"
      width="130"
      show-overflow-tooltip
    >
      <template #default="scoped">
        <span>{{ scoped.row.fMaterialName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="contactsDeptName" label="存货类别" align="center" />
    <el-table-column
      prop="fMaterialModel"
      label="规格型号"
      align="center"
      width="180"
      show-overflow-tooltip
    />
    <el-table-column prop="fIsPrecisionPart" label="精密件" align="center" />
    <el-table-column prop="ff100001" label="喷砂亮银" align="center" />
    <el-table-column prop="fVersionNo" label="版本号" align="center" />
    <el-table-column prop="fUnitId" label="单位" align="center" width="100">
      <template #default="scoped">
        <span>{{ scoped.row.fUnitName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fQty" label="销售数量 " align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fQty }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fIsFree" label="是否赠品 " align="center" width="130">
      <template #default="scoped">
        <span>
          <span v-if="scoped.row.fIsFree === false">否</span>
          <span v-else>是</span></span
        >
      </template>
    </el-table-column>
    <el-table-column prop="fDeliveryDate" label="要货日期 " align="center" width="180">
      <template #default="scoped">
        <span> {{ scoped.row.fDeliveryDate }}</span>
      </template>
    </el-table-column>
    <el-table-column
      prop="fStockOrgId"
      label="库存组织 "
      align="center"
      width="180"
      show-overflow-tooltip
    >
      <template #default="scoped">
        <span>
          {{ scoped.row.fStockOrgDictName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column
      prop="fPeSettleOrgId"
      label="结算组织 "
      align="center"
      width="180"
      show-overflow-tooltip
    >
      <template #default="scoped">
        <span>
          {{ scoped.row.fPeSettleOrgDictName }}
        </span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fBomId" label="BOM版本 " align="center" />
    <el-table-column prop="fOwnerTypeId" label="货主类型 " align="center" /> -->
    <el-table-column
      prop="fStockOrgDictName"
      label="货主"
      align="center"
      width="180"
      show-overflow-tooltip
    />
    <!-- <el-table-column prop="fOraPrice" label="核价" align="center" /> -->
    <el-table-column prop="fEntryNote" label="备注" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEntryNote }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fMtoNo" label="计划跟踪号" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fMtoNo }}</span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fBdkText" label="实际品名" align="center" />
    <el-table-column prop="fBdkText1" label="客户物料代码" align="center" /> -->
    <el-table-column
      prop="fBdkText2"
      label="客户物料名称"
      align="center"
      width="180"
      show-overflow-tooltip
    />
    <el-table-column prop="fBdkText3" label="客户PO" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fBdkText3 }}</span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fBdkText4" label="客户ID" align="center" />
    <el-table-column prop="fBdkText5" label="成品和模组料号" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fBdkText5 }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkBaseProperty" label="旧物料编码" align="center" /> -->
    <el-table-column prop="fBdkText8" label="内部PM" align="center" width="180">
      <template #default="scoped">
        <dc-view v-model="scoped.row.fBdkText8" objectName="user" showKey="realName" />
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText9" label="机构工程" align="center" width="180">
      <template #default="scoped">
        <dc-view v-model="scoped.row.fBdkText9" objectName="user" showKey="realName" />
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText10" label="电气工程" align="center" width="180">
      <template #default="scoped">
        <dc-view v-model="scoped.row.fBdkText10" objectName="user" showKey="realName" />
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText11" label="电子工程师" align="center" width="180">
      <template #default="scoped">
        <dc-view v-model="scoped.row.fBdkText11" objectName="user" showKey="realName" />
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText12" label="软件工程" align="center" width="180">
      <template #default="scoped">
        <dc-view v-model="scoped.row.fBdkText12" objectName="user" showKey="realName" />
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fBusinessDivisionId" label="事业部" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fBusinessDivisionId }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText14" label="客户规格型号" align="center" />
    <el-table-column prop="fQlktDate" label="客户下单日期" align="center" />
    <el-table-column prop="fQlktText6" label="请购部门" align="center" />
    <el-table-column prop="fQlktText7" label="2D" align="center" />
    <el-table-column prop="fQlktText8" label="Catagory" align="center" />
    <el-table-column prop="fQlktText9" label="订单项次号" align="center" />
    <el-table-column prop="fQlktText10" label="请购人" align="center" />
    <el-table-column prop="fOraCheckbox" label="是否手工已推应收 " align="center" /> -->
    <el-table-column prop="fEwProducSeriesId" label="产品系列" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEwProducSeriesName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwPhase" label="阶段" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEwPhaseName }}</span>
      </template>
    </el-table-column>

    <el-table-column
      prop="fOraAssistant1"
      label="项目名称"
      align="center"
      width="180"
      show-overflow-tooltip
    >
      <template #default="scoped">
        <span>{{ scoped.row.fOraAssistant1Name }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fOraDate" label="源单日期" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fOraDate }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fOraDate1" label="要求齐套日" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fOraDate1 }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fOraQty" label="库存" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fOraQty }}</span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fOraText2" label="跟单" align="center" />
    <el-table-column prop="fOraText4" label="PM回复交期" align="center" /> -->
    <el-table-column prop="fOraText5" label="客户交期ETA" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fOraText5 }}</span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fOraCombo1" label="是否验收" align="center" />
    <el-table-column prop="fPersonLiable" label="负责人" align="center" width="180">
      <template #default="scoped">
        <dc-dict v-model="scoped.row.fPersonLiable" objectName="user" showKey="realName" />
      </template>
    </el-table-column> -->
    <el-table-column prop="fCostAttrMtoNo" label="成本归属专案" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fCostAttrMtoNo }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwTpm" label="TPM " align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEwTpmName }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwCostType" label="成本类型" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwCostTypeName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwFreeReason" label="免费原因" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwFreeReasonName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwInternalEtd" label="内部ETD" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEwInternalEtd }}</span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fEwMerchandiserEtd" label="回复跟单ETD" align="center" /> -->
    <el-table-column prop="fEwIsCustomsDeclaration" label="是否报关" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsCustomsDeclaration" disabled />
      </template>
    </el-table-column>
    <el-table-column prop="fEwIsMrpRun" label="是否需要运算" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsMrpRun" disabled />
      </template>
    </el-table-column>
    <el-table-column prop="fEwIsPreStock" label="是否需要备料" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsPreStock" disabled />
      </template>
    </el-table-column>
    <el-table-column prop="fEwCustomerProduct" label="客户产品" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwCustomerProduct }}
        </span>
      </template>
    </el-table-column>
    <el-table-column label="项目类型" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwProjectTypeName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column label="设备属性" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwDeviceAttributeName }}
        </span>
      </template>
    </el-table-column>
  </el-table>
  <!-- 预测单表格 -->
  <el-table :data="formData.dcErpOrderItemList" v-else>
    <el-table-column label="序号" width="60" type="index" align="center">
      <template #default="scoped">
        <span>{{ (queryParams.current - 1) * queryParams.size + scoped.$index + 1 }}</span>
      </template>
    </el-table-column>

    <el-table-column
      prop="fSupplyOrgId"
      label="供应组织"
      align="center"
      width="150"
      show-overflow-tooltip
    >
      <template #default="scoped"> {{ scoped.row.fSupplyOrgDictName }} </template>
    </el-table-column>

    <el-table-column
      prop="fCustIdName"
      label="客户"
      align="center"
      width="150"
      show-overflow-tooltip
    />

    <!-- <el-table-column
      prop="fEwGroupCust"
      label="对应集团客户"
      align="center"
      width="150"
      show-overflow-tooltip
    /> -->

    <el-table-column
      prop="fMaterialId"
      label="物料编码"
      align="center"
      width="150"
      show-overflow-tooltip
    >
    </el-table-column>
    <el-table-column
      prop="fMaterialName"
      label="物料名称"
      align="center"
      width="130"
      show-overflow-tooltip
    />

    <el-table-column
      prop="fMaterialModel"
      label="规格型号"
      align="center"
      width="180"
      show-overflow-tooltip
    />
    <el-table-column prop="fBomId" label="BOM版本 " align="center" />
    <el-table-column
      prop="fOraAssistant1Name"
      label="项目名称"
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <el-table-column prop="fUnitName" label="单位" align="center" width="100" />

    <el-table-column prop="fQty" label="销售数量 " align="center" width="180" />

    <el-table-column prop="fStartDate" label="预测开始日期 " align="center" width="180" />

    <el-table-column prop="fEndDate" label="预测结束日期 " align="center" width="180" />

    <el-table-column prop="fMtoNo" label="计划跟踪号" align="center" width="180" />

    <el-table-column prop="ff100001" label="喷砂亮银" align="center" />
    <el-table-column prop="fVersionNo" label="版本号" align="center" />

    <el-table-column prop="fAveraTypeName" label="均化类型" align="center" width="180" />

    <el-table-column prop="fAveraCycle" label="均化周期" align="center" width="180" />

    <el-table-column
      prop="fStockOrgDictName"
      label="库存组织 "
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <!-- <el-table-column prop="fOwnerTypeId" label="货主类型 " align="center" /> -->

    <el-table-column
      prop="fStockOrgDictName"
      label="货主 "
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <el-table-column prop="fReserveTypeName" label="预留类型" align="center" width="180" />

    <!-- <el-table-column prop="fPriority" label="需求优先级" align="center" /> -->

    <el-table-column prop="fEntryNote" label="备注" align="center" width="180" />

    <el-table-column prop="fExchangeRate" label="汇率" align="center" width="150" />

    <el-table-column prop="fSettleCurrIdName" label="结算币种" align="center" />

    <el-table-column prop="fOraTaxRate" label="税率" align="center" width="150" />

    <el-table-column prop="fCostAttrMtoNo" label="项目编号" align="center" width="180" />

    <el-table-column prop="fBdkText8" label="内部PM" align="center" width="180">
      <template #default="scoped">
        <span>
          <dc-view v-model="scoped.row.fBdkText8" objectName="user" showKey="realName"
        /></span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText9" label="机构工程" align="center" width="180">
      <template #default="scoped">
        <span>
          <dc-view v-model="scoped.row.fBdkText9" objectName="user" showKey="realName"
        /></span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText10" label="电气工程" align="center" width="180">
      <template #default="scoped">
        <span>
          <dc-view v-model="scoped.row.fBdkText10" objectName="user" showKey="realName"
        /></span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText11" label="电子工程师" align="center" width="180">
      <template #default="scoped">
        <span>
          <dc-view v-model="scoped.row.fBdkText11" objectName="user" showKey="realName"
        /></span>
      </template>
    </el-table-column>
    <el-table-column prop="fBdkText12" label="软件工程" align="center" width="180">
      <template #default="scoped">
        <span>
          <dc-view v-model="scoped.row.fBdkText12" objectName="user" showKey="realName"
        /></span>
      </template>
    </el-table-column>
    <!-- <el-table-column prop="fBusinessDivisionId" label="事业部" align="center" width="180" /> -->

    <el-table-column prop="fEwTpmName" label="TPM " align="center" width="180" />

    <el-table-column prop="fBdkBase1Name" label="销售员 " align="center" width="180" />

    <el-table-column
      prop="fEwSaleDeptIdName"
      label="销售部门"
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <!-- <el-table-column
      prop="fBdkBaseProperty"
      label="旧物料编码"
      align="center"
      width="180"
      show-overflow-tooltip
    /> -->

    <el-table-column prop="fQlktDate" label="客户下单日期 " align="center" width="180" />

    <el-table-column prop="fDeliveryDate" label="要货日期 " align="center" width="180" />

    <el-table-column
      prop="fEwProjectTypeName"
      label="项目"
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <el-table-column
      prop="fOraCombo"
      label="订单类型"
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <!-- <el-table-column prop="fBdkText1" label="客户物料代码" align="center" width="180" />

    <el-table-column prop="fBdkText2" label="客户物料名称" align="center" width="180" />

    <el-table-column prop="fBdkText14" label="客户规格型号" align="center" width="180" /> -->

    <el-table-column prop="fEwPhaseName" label="阶段" align="center" width="180" />

    <el-table-column
      prop="fOraBase4Name"
      label="终端客户"
      align="center"
      width="180"
      show-overflow-tooltip
    />

    <el-table-column prop="fOraDate1" label="要求齐套日 " align="center" width="180" />

    <el-table-column prop="fOraQty" label="库存" align="center" width="150" />

    <el-table-column prop="fOraText4" label="PM回复交期 " align="center" width="180" />

    <el-table-column prop="fEwCostTypeName" label="成本类型" align="center" width="180" />

    <el-table-column prop="fEwInternalEtd" label="内部ETD" align="center" width="180" />

    <el-table-column prop="fEwMerchandiserEtd" label="回复跟单ETD" align="center" width="180" />

    <el-table-column prop="fEwIsCustomsDeclaration" label="是否报关" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsCustomsDeclaration" disabled />
      </template>
    </el-table-column>
    <el-table-column prop="fEwIsMrpRun" label="是否需要运算" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsMrpRun" disabled />
      </template>
    </el-table-column>
    <el-table-column prop="fEwIsPreStock" label="是否需要备料" align="center">
      <template #default="scoped">
        <el-checkbox v-model="scoped.row.fEwIsPreStock" disabled />
      </template>
    </el-table-column>

    <el-table-column prop="fEwCustomerProduct" label="客户产品" align="center" width="180" />

    <el-table-column label="项目类型" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwProjectTypeName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column label="设备属性" align="center" width="180">
      <template #default="scoped">
        <span>
          {{ scoped.row.fEwDeviceAttributeName }}
        </span>
      </template>
    </el-table-column>
    <el-table-column prop="fEwProducSeriesId" label="产品系列" align="center" width="180">
      <template #default="scoped">
        <span>{{ scoped.row.fEwProducSeriesName }}</span>
      </template>
    </el-table-column>
  </el-table>

  <el-form class="custom-form" label-width="120px" :inline="true" v-if="info.createUser != null">
    <div class="form-item-info mt-5 form-display">
      <el-form-item label="发起人">
        <dc-view v-model="info.createUser" objectName="user"
      /></el-form-item>
      <el-form-item label="发起时间">
        {{ info.createTime }}
      </el-form-item>
      <el-form-item label="发起部门">
        <dc-view v-model="info.createDept" objectName="dept"
      /></el-form-item>
    </div>
  </el-form>
</template>

<script setup name="executionSubmit">
import { reactive, toRefs, onMounted } from 'vue';

const { proxy } = getCurrentInstance();
const pageData = reactive({
  queryParams: {
    current: 1,
    size: 10,
  },
  formData: {
    fBillTypeDictParent: null,
  },
});

const { formData, queryParams } = toRefs(pageData);

// 数据字典
const { DC_BILL_TYPE } = proxy.useCache([{ key: 'DC_BILL_TYPE' }]);

const props = defineProps({
  // 详情
  info: {
    type: Object,
    default: {},
  },
});

onMounted(() => {
  formData.value = props.info;
  setTimeout(() => {
    const selectedOption = findOptionByDictKey(formData.value.fBillTypeId);
    if (selectedOption) {
      formData.value.fBillTypeDictParent = selectedOption.parentId;
    }
  });
});

const findOptionByDictKey = dictKey => {
  for (const group of DC_BILL_TYPE.value) {
    if (group.dictKey === dictKey) {
      return group;
    }
  }

  return null;
};
</script>
<style lang="scss">
.business-container {
  .basic-container__card {
    background-color: transparent;

    .el-card__body {
      padding: 0 !important;
    }
  }
}
</style>
<style lang="scss">
.custom-form {
  display: flex;
  flex-wrap: wrap;

  .form-item-info {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  .form-itme-width_25 {
    width: 25% !important;
    margin-right: 0;

    .el-form-item__content {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .form-item-value {
      width: 100%;
      height: 100%;
      border-radius: 4px;
      border: 1px solid #ccc;

      span {
        padding-left: 10px;
      }

      .form-item-placeholder {
        padding-left: 10px;
        color: #a8abb2;
      }
    }

    .form-item-enterprise {
      padding: 9px 12px;
      border: 1px solid #dadbe0;
      font-weight: 400;
      font-size: 14px;
      color: #333;
      line-height: 14px;
      border-radius: 4px;
    }

    .active {
      border: none;
      background: #f78431;
      color: #fff;
    }
  }
}

@media (max-width: 1360px) {
  .form-itme-width_25 {
    width: 100% !important;
    margin-right: 0;
    overflow: hidden;
  }
}
</style>
<style scoped lang="scss">
.wrap-left-form {
  display: flex;
  justify-content: center;
}

.form-center {
  display: flex;
  flex-wrap: wrap;
}

.form-group-header-title {
  margin: 28px 0 20px 0 !important;
}

.form-group-header-btn {
  margin-bottom: 22px;
}

.form-group-title {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 28px 0 32px 0;
  font-weight: 600;
  font-size: 16px;
  color: #333;

  &::before {
    margin-right: 4px;
    display: block;
    content: '';
    width: 4px;
    height: 13px;
    background-color: #f78431;
  }

  .add-box {
    display: flex;
    align-items: center;
    margin-left: 40px;
    font-weight: 400;
    font-size: 14px;
    color: #f78431;
    cursor: pointer;
  }
}

.form-item-row {
  width: 93% !important;
}

.form-item-width {
  width: 100%;
}

.ipt {
  width: 100%;
  border: 0px;
  background: none;
}
</style>
